<template is="msgItem1">
	<view class="content">
		
		<view class="user-img"><!-- <img src="/static/ritter.jpg"><view class="user-name">时尚小博主</view> --></view>
		
		<button class="share-button" open-type="getUserInfo" lang="zh_CN" @getuserinfo="bindGetUserInfo"><img src="/static/wechat.png">微信授权登录</button>
		
	</view>
</template>

<script>
	export default {
		data() {
			return {
				userinfo:"",
				code:""
			}
		},
		onLoad() {
			
		},
		methods: {
			bindGetUserInfo(e){
				var _self = this
				_self.userinfo = e.detail.userInfo;
				uni.login({
				  provider: 'weixin',
				  success: function (loginRes) {
					_self.code = loginRes.code
					uni.request({
					    url: _self.$url + '/api/user/login', //仅为示例，并非真实接口地址。
						method:"post",
					    data: {
					        code:_self.code,
							nick:_self.userinfo.nickName,
							avatar:_self.userinfo.avatarUrl,
							sex:_self.userinfo.gender,
							oauth:"miniapp",
					    },
					    success: (res) => {
					        if(res.data.status == "1"){
								uni.setStorage({
								    key: 'userinfo',
								    data: res.data.result,
								    success: function () {
								        uni.showToast({
								            title: '登陆成功',
								            duration: 2000,
											icon:"success",
											success:function(){
												uni.navigateBack({
												    delta: 1
												});
											}
								        });
										
								    }
								});
							}
					    }
					});
				  }
				});
				
			},
			
		}
	}
</script>

<style lang="scss">
	body{
		background: #F3F3F3;
		font-size: 14px;
	}
	view{
		box-sizing: border-box;
	}
	.user-img{
		width: 200rpx;
		height: 200rpx;
		margin:200rpx auto;
		text-align: center;
		img{
			width: 200rpx;
			height: 200rpx;
			border-radius: 50%;
		}
		.user-name{
			margin-top:20rpx;
		}
	}
	.share-button{
		background: #F4313E;
		color:#fff;
		width: 90%;
		display: flex;
		flex-direction: row;
		align-items: center;
		justify-content: center;
		margin:0 auto;
		padding:10rpx 0;
		border-radius: 5px;
		margin-bottom:25rpx;
		font-size: 14px;
		img{
			width: 35rpx;
			height: 35rpx;
			margin-right: 15rpx;
		}
	}
	
</style>
